import 'package:flutter/material.dart';
import 'package:local_coffee/components/c_appbar/custom_appbar.dart';
import 'package:local_coffee/components/c_stepper/custom_stepper.dart';
import 'package:local_coffee/components/hex.dart';
import 'package:local_coffee/utils/global.dart';

class ExampleAStepper extends StatefulWidget {
  
  ExampleAStepper({
    Key key
  }) : super(key: key);

  @override
  _ExampleStepperState createState() => _ExampleStepperState();
}

class _ExampleStepperState extends State<ExampleAStepper> {
  
  int num1 = 1;

  int num2 = 2;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: customAppBar(
        title: '步进器',
        context: context
      ),
      body: Container(
        color: HEX.hexfff,
        padding: EdgeInsets.symmetric(horizontal: 15),
        child: SingleChildScrollView(
          child: Column(
            children: <Widget>[
              returnRow(
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    Text('基础用法'),
                    CustomStepper(
                      value: num1,
                      onChange: (val) {
                        setState(() {
                          num1 = val;
                        });
                      },
                    )
                  ],
                )
              ),
              returnRow(
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    Text('限制范围 2~5'),
                    CustomStepper(
                      value: num2,
                      min: 2,
                      max: 5,
                      onChange: (val) {
                        setState(() {
                          num2 = val;
                        });
                      },
                    )
                  ],
                )
              )
            ],
          ),
        ),
      ),
    );
  }

  Container returnRow({
    Widget child
  }) {
    return Container(
      decoration: BoxDecoration(
        border: G.borderBottom()
      ),
      padding: EdgeInsets.symmetric(vertical: 15),
      child: child,
    );
  }
}